<template>
    <QilinKaitify :kaitifyConfig="kaitifyConfig" v-model="content"></QilinKaitify>
</template>

<script setup>
import {reactive,ref,onMounted} from "vue";


/*
    响应式选项区域
*/


/*
    数据变量定义区域
*/


/*
    计算属性等代码区域
*/


/*
    逻辑脚本代码区域
*/
let content = ref("");
const kaitifyConfig = reactive({
    placeholder:"请输入内容...",
    menuPopoverProps:{
        zIndex:5000
    },
    menuImageProps:{
        customUpload:(ref,file)=>{
            console.log(file,111);
            let formData = new FormData();
            formData.append("file",file);
            fetch("http://36.134.22.190:8061/common/upload",{
                headers:{
                    Authorization:"Bearer eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJsb2dpblR5cGUiOiJsb2dpbiIsImxvZ2luSWQiOiJzeXNfdXNlcjoxIiwicm5TdHIiOiI1cXA3cldBc1FvTFFOMXZlOW5PcW9hQWdzNklmTzk1OSIsInVzZXJJZCI6MX0.ewEG_-K-bwUglyawPJmtj147CHbqxRRaiEEcTDyBYM8"
                },
                method:"post",
                body:formData
            }).then((response)=>{
                // console.log(response);
                return response.json();
            }).then((res)=>{
                // console.log(res);
                ref.state.editor.commands.setImage({
                    src:res.data.url,
                    width:"300px",
                    alt:"图片加载失败"
                });
            });
        }
    },
    onPasteImage:(ref,file)=>{
        console.log(file,111);
        let formData = new FormData();
        formData.append("file",file);
        fetch("http://36.134.22.190:8061/common/upload",{
            headers:{
                Authorization:"Bearer eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJsb2dpblR5cGUiOiJsb2dpbiIsImxvZ2luSWQiOiJzeXNfdXNlcjoxIiwicm5TdHIiOiI1cXA3cldBc1FvTFFOMXZlOW5PcW9hQWdzNklmTzk1OSIsInVzZXJJZCI6MX0.ewEG_-K-bwUglyawPJmtj147CHbqxRRaiEEcTDyBYM8"
            },
            method:"post",
            body:formData
        }).then((response)=>{
            // console.log(response);
            return response.json();
        }).then((res)=>{
            // console.log(res);
            ref.state.editor.commands.setImage({
                src:res.data.url,
                width:"300px",
                alt:"图片加载失败"
            });
        });
    }
});


/*
    生命周期等代码区域
*/
// onMounted(()=>{
    content.value = "模拟延时响应";
// });


</script>

<style lang="scss" scoped>
</style>
